import React, { Component } from 'react'

export default class EventCom extends Component {
    constructor() {
        super();
        this.state = {
            count: 0
        }
        this.jian = this.jian.bind(this);
    }
    render() {
        return (
            <div>
                {/* 不绑定this，默认是undefined，因为add函数是react内部调用的，不知道怎么绑定this */}
                {/* bind的方式$event默认在最后一个参数 */}
                <button onClick={this.add.bind(this)}>{this.state.count}</button>
                {/* 此语法每次都会创建不同的回调函数，所以推荐在构造函数中进行this绑定 */}
                <button onClick={(e) => { this.add5(e,5) }}>{this.state.count}</button>
                <button onClick={this.jian}>{this.state.count}</button>
            </div>
        )
    }
    add() {
        this.setState({
            count: this.state.count + 1
        })
    }
    jian() {
        this.setState({
            count: this.state.count - 1
        })
    }
    add5 = (e,num) => {
        console.log(e);
        this.setState({
            count: this.state.count + num
        })
    }
}